<!DOCTYPE html>
<html lang="en" class="x-admin-sm">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>修改密码</title>
    <link rel="stylesheet" href="./assets/layui/css/layui.css" media="all" />
    <script type="text/javascript" src="./assets/layui/layui.js"></script>
</head>

<body class="childrenBody">
    <div id="app">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>修改密码</legend>
        </fieldset>
        <div class="layui-form" style="width: 80%;">
            <div class="layui-form-item"><label class="layui-form-label">用户名</label>
                <div class="layui-input-block">{{ adminname }}</div>
            </div>
            <div class="layui-form-item"><label class="layui-form-label">密码</label>
                <div class="layui-input-block"><input type="password" class="layui-input" id="password" 
                        v-model="password" placeholder="请输入密码" /></div>
            </div>
            <div class="layui-form-item"><label class="layui-form-label">新密码</label>
                <div class="layui-input-block"><input type="password" class="layui-input" id="newpassword" 
                        v-model="newpassword" placeholder="请输入新密码" /></div>
            </div>
            <div class="layui-form-item"><label class="layui-form-label">确认密码</label>
                <div class="layui-input-block"><input type="password" class="layui-input" id="repassword" 
                        v-model="repassword" placeholder="请输入确认密码" /></div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" type="button" @click.prevent="editpwd()">提交保存</button>
                    <button class="layui-btn" type="button" @click.prevent="reset()">取消重置</button>
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript" src="./assets/js/axios.min.js"></script>
    <script type="text/javascript" src="./assets/js/vue.js"></script>
    <script type="text/javascript" src="./assets/js/jquery.min.js"></script>
    <script type="text/javascript">
		const vue = new Vue({ // 实例化Vue对象
			el: '#app',// 绑定作用域
			data: { //定义数据 用于vue的双向绑定
				adminid: '',
				adminname: '',
				password: '',
				newpassword: '',
				repassword: '',
			},
			methods: {
				editpwd: function () { // 修改按钮点击事件
					let _this = this;
					var data = {
						adminid: _this.adminid,
						password: _this.password,
						repassword: _this.repassword,
					};
					axios.post('http://localhost:8080/vue_gxhfztjxt/admin/editpwd.action', data).then(result => {
						alert(result.data.message);
						var index = parent.layer.getFrameIndex(window.name);
						parent.layer.close(index);
					});
				},
				reset: function () { // 重置按钮点击事件
					password = '';
					newpassword = '';
					repassword = '';
				},
				validate: function () { // 验证输入非空

				},
				loadPage: function () { // 页面加载
					this.adminid = sessionStorage.getItem('adminid');
					this.adminname = sessionStorage.getItem('adminname');
				},
			},
			created() { // 生命周期相关的函数
				this.loadPage();
			},
		})
	</script>

</body>

</html>


